<template>
  <div>
    <el-dialog
      title="纠错信息"
      :visible.sync="dialogVisible"
      width="800px"
      :lock-scroll="false"
      :close-on-click-modal="false"
    >
      <div class="detail">
        <el-row :gutter="20">
          <el-col :span="12" v-if="flag"
            >创建人： {{ checkedData.sysUser.userName }}</el-col
          >
          <el-col :span="12">创建时间： {{ checkedData.createTime }}</el-col>
        </el-row>
        <div class="content-wrap" v-html="content"></div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">关 闭</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import Bus from "@/utils/bus.js";
export default {
  data() {
    return {
      flag: false,
      dialogVisible: false,
      checkedData: {},
      content: "",
    };
  },
  mounted() {
    Bus.$on("showDialogFeedbackDetail", (v) => {
      this.checkedData = v;
      this.content = v.content
        .replace(/&nbsp;/gi, "") //清除空格
        .replace(/\s+style="[^"]*"/g, "") //清除style样式
        .replace(
          /\<img/gi,
          '<img style="max-width: 90%;margin: 10px auto;display: inherit;border: 1px solid #eee;"'
        ); //设置图片class
      this.flag = true;
      this.dialogVisible = true;
    });
  },
  beforeDestroy() {
    Bus.$off("showDialogFeedbackDetail");
  },
};
</script>
<style scoped>
.content-wrap {
  min-height: 300px;
  border: 1px solid #eee;
  padding: 10px;
}
</style>